import { Suspense } from "react"
import ClassroomDashboard from "@/components/classroom-dashboard"
import { LoadingDashboard } from "@/components/loading-dashboard"
import { ClassSelector } from "@/components/class-selector"
import { VideoMonitoring } from "@/components/flv-play"
export default function Home() {
  return (
    <div className="mx-auto max-w-7xl space-y-6">
      <div className="flex flex-col justify-between gap-4 sm:flex-row sm:items-center">
        <h1 className="text-2xl font-bold md:text-3xl">课堂实时监测</h1>
        <ClassSelector />
      </div>

      {/* 添加视频监测组件 */}
      <VideoMonitoring />

      <Suspense fallback={<LoadingDashboard />}>
        <ClassroomDashboard />
      </Suspense>
    </div>
  )
}
